<template>
	<view class="searchInput pd">
		<safeTopVue :backgroundColor="'var(--homePageBackground)'" />
		<view class="rowStart" style="gap: 20rpx;">
			<uv-icon name="arrow-left" @click="back"></uv-icon>
			<view class="w100 pd" style="background-color: var(--themeDefultBackground);">
				<uv-input :placeholder="placeholder" prefixIcon="search" border="none" 
					@confirm="confirm" prefixIconStyle="font-size: 22px;color: #909399"></uv-input>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			placeholder: {
				type: String,
				default: "搜索"
			}
		},
		name: "searchInput",
		data() {
			return {

			};
		},
		methods: {
			back() {
				uni.navigateBack({
					delta: 1
				})
			},
			confirm(e) {
				this.$emit('enterValue', e)
			}
		}
	}
</script>

<style lang="scss">
	.searchInput {

		background-color: #fff;
	}

	.pd {
		padding: 20rpx;
		box-sizing: border-box;
	}
</style>